<template>
  <div class="tableCard">
    <a-row :gutter="16">
      <a-col
        class="gutter-row"
        :span="8"
        v-for="(item, index) in tableList"
        :key="'item' + index"
      >
        <div class="block" @click="moreClick(item)">
          <img
            :src="item.img"
            alt=""
            v-if="item.img && item.img !== ''"
            class="imgClass"
            :style="`height:${height}px`"
          />
          <img src="/static/noImg.png" alt="" class="imgClass imgNone" v-else />
          <div
            class="firstText"
            @click="moreClick(item)"
            v-if="textType === 'firstText'"
          >
            {{ item.name || item.title || '-' }}
          </div>
        </div>
        <div class="text" @click="moreClick(item)">
          <span v-if="textType === 'common'">
            {{ item.name || item.title || '-' }}
          </span>
        </div>
      </a-col>
    </a-row>
  </div>
</template>

<script>
export default {
  props: {
    tableList: Array,
    height: {
      type: [Number,String],
      default: () => 224
    },
    textType: {
      type: String,
      default: 'common'
    }
  },
  data() {
    return {}
  },
  mounted() {

  },
  methods: {
    moreClick(val) {
      this.$emit('moreChange', val)
    }
  }
}
</script>
